<template>
  <view class="page-section">
    <view class="uni-padding-wrap uni-common-mt">
      <uni-segmented-control :current="current" :values="items" style-type="text" active-color="#007aff"
        @clickItem="onClickItem" />
    </view>
    <view>
      <view v-if="current === 0">
        <uni-load-more status="more" :content-text="contentText"></uni-load-more>
        <my-articleone :activelist="activenBegin"></my-articleone>
        <uni-load-more status="noMore" :content-text="contentText" :click='activeclick'></uni-load-more>
      </view>
      <view v-if="current === 1">
        <uni-load-more status="more" :content-text="contentText"></uni-load-more>
        <my-articleone :activelist="activelist"></my-articleone>
        <uni-load-more status="noMore" :content-text="contentText" :click='activeclick'></uni-load-more>
      </view>
      <view v-if="current === 2">
      <uni-load-more status="more" :content-text="contentText"></uni-load-more>
      <my-articleone :activelist="activenOne"></my-articleone>
      <uni-load-more status="noMore" :content-text="contentText" :click='activeclick'></uni-load-more>
      </view>
      <view v-if="current === 3">
      <uni-load-more status="more" :content-text="contentText"></uni-load-more>
      <my-articleone :activelist="activenTow"></my-articleone>
      <uni-load-more status="noMore" :content-text="contentText" :click='activeclick'></uni-load-more>
      </view>
      <view v-if="current === 4">
        <uni-load-more status="more" :content-text="contentText"></uni-load-more>
        <my-articleone :activelist="activenThree"></my-articleone>
        <uni-load-more status="noMore" :content-text="contentText" :click='activeclick'></uni-load-more>
      </view>
      <view v-if="current === 5">
        <uni-load-more status="more" :content-text="contentText"></uni-load-more>
        <my-articleone :activelist="activenFour"></my-articleone>
        <uni-load-more status="noMore" :content-text="contentText" :click='activeclick'></uni-load-more>
      </view>
    </view>
  </view>
</template>

<script>
  import activeList from '@/mixins/active-list.js'
  export default {
    name: "my-DetailedArticle",
    mixins:[activeList],
    data() {
      return {
        activeclick:'click',
        contentText: {
          contentdown: '最新收录',
          contentrefresh: '加载中',
          contentnomore: '查看更多请单击移步公众号😊'
        },
        avatar: 'https://web-assets.dcloud.net.cn/unidoc/zh/unicloudlogo.png',
        items: ['web前端','漫威', '动漫', '国外', '国内', 'DC影坛', ],
        current: 0,
      }
    },
    methods: {
      onClickItem(e) {
        if (this.current != e.currentIndex) {
          this.current = e.currentIndex;
        }
      },
    }
  }
</script>

<style lang="scss">
  .page-section {
    background-color: #fff;
  }
</style>
